<template>
    <div class="pie" v-if="Visible">
        <echatrs :id="id" :option="option"></echatrs>
    </div>
</template>

<script>
    import echatrs from '@/components/echatrs'
    export default {
        name: "pie",
        data(){
            return{
                option:{},
                Visible:false
            }
        },
        props:{
          id:String
        },
        components:{
            echatrs
        },
        methods:{
            format(option){
                this.option = {
                    title: {
                        text: null
                    },
                    tooltip: {
                        trigger: 'item',
                        formatter: '{a} <br/>{b} : {c} ({d}%)'
                    },

                    series: [
                        {
                            name: option.name || '标题',
                            type: 'pie',
                            radius: option.radius || '60%',
                            center: ['50%', '50%'],
                            data: option.series.sort(function (a, b) {
                                return a.value - b.value;
                            }),
                            ...option.solt
                        }
                    ]
                };
                this.Visible = true
            }
        }
    }
</script>

<style scoped lang="less">
    .pie{
        width: 100%;
        height: 100%;
    }
</style>
